<table class="table table-bordered" data-toggle="datagrid" data-options="{
    height: '100%',
    gridTitle : '权限管理',
    showToolbar: true,
    toolbarItem: 'add,edit,|,del,|,cancel,save,|,refresh',
    local: 'remote',
    dataUrl: '/role/list',
    editUrl: '/role/update',
    delUrl: '/role/del',
    delPK:'id',
    paging: {pageSize:50, pageCurrent:1},
    linenumberAll: true,
    hiddenFields:['id'],
    keys:{updated:'updated'},
    showCheckboxcol: true,
   columnMenu:false,
   afterSave:function(n,d){}
}">
    <thead>
        <tr>
            <th data-options="{rule:'required;max(50)',name:'rolename',width:150}">角色名称</th>
            <th data-options="{quickfilter:false,width:200,name:'desc',align:'center',type:'textarea'}">描述</th>
            <th data-options="{width:200,name:'updated',align:'center',type:'date',pattern:'yyyy-MM-dd',add:false,edit:false}">操作时间</th>
            <th data-options="{render:datagrid_operation}">操作列</th>
        </tr>
    </thead>
</table>

<script type="text/javascript">

// 操作列
function datagrid_operation(value,data) {
    var html = '<button type="button" class="btn-green" data-toggle="edit.datagrid.tr">编辑</button>'
        + '<button type="button" class="btn-red" data-toggle="del.datagrid.tr">删除</button>'
        + '<button type="button"  data-icon="paypal" data-options="{mask:true, width:600, height:700 }" class="btn-orange" data-toggle="dialog"  data-url="/role/authList?roleid='+data.id+'">权限</button>';
    
    return html
}
</script>
